<template>
    <div>
        <table>
            <tr>
                <td>房型名称</td>
                <td><input type="text" v-model="state.name"></td>
            </tr>
            <tr>
                <td>门市价</td>
                <td><input type="text" v-model="state.price"></td>
            </tr>
            <tr>
                <td>押金</td>
                <td><input type="text" v-model="state.deposit"></td>
            </tr>
            <tr>
                <td>面积</td>
                <td><input type="text" v-model="state.size"></td>
            </tr>
            <tr>
                <td>可住人数</td>
                <td><input type="text" v-model="state.num"></td>
            </tr>
            <tr>
                <td>可否加床</td>
                <td>
                    <select v-model="state.addBed">
                        <option value="">请选择</option>
                        <option value="是">是</option>
                        <option value="否">否</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>房型图片</td>
                <td>
                    <input type="file" @change="shang">
                    <img :src="src" alt="" width="50px" height="50px" v-if="src!=''">
                </td>
            </tr>
            <tr>
                <td>房型介绍</td>
                <td><textarea v-model="state.indo"></textarea></td>
            </tr>
            <tr>
                <td>房型状态</td>
                <td><input type="text" v-model="state.state"></td>
            </tr>
            <tr>
                <td colspan="2"><input type="button" value="保存" @click="add"></td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import { reactive,toRefs,onMounted } from 'vue';
import { useRouter,useRoute } from 'vue-router';
import axios from 'axios'
const router = useRouter()
const route = useRoute()

const data = reactive({
    state:{
        name:'',
        price:'',
        deposit:'',
        size:'',
        num:'',
        state:'',
        addBed:'',
        indo:'',
        img:''
      
    },
    src:'',
})

const {state,src} = toRefs(data)


const shang = (e:any)=>{
    let file = e.target.files[0]
    let from = new FormData()
  from.append('file',file)
  axios({
    url:'https://localhost:7021/api/image',
    method:'post',
    data:from
  }).then((res)=>{
    src.value='https://localhost:7021' + res.data.fileName
    state.value.img=res.data.fileName
  })
}
const add=()=>{
    axios({
        url:'https://localhost:7021/api/Member/AddMember',
        method:'post',
        data:state.value
    }).then((res)=>{
        if(res.data.data>0){
            alert('添加成功')
         
        }else{
            alert('添加失败')
        }
    })
}





</script>

<style scoped>

</style>    